<template>
  <el-dialog
      title="试题列表"
      :close-on-click-modal="false"
      :visible.sync="visible">
    <div class="app-container">
      <el-form :inline="true" :model="dataForm" ref="dataForm" @keyup.enter.native="getDataList()">
        <el-form-item label="题目名称" prop="content">
          <el-input v-model="dataForm.content" placeholder="请输入题目名称"></el-input>
        </el-form-item>
        <el-form-item label="课程名称" prop="content">
          <el-input v-model="dataForm.courseName" placeholder="请输入课程名称"></el-input>
        </el-form-item>
        <el-form-item>
          <el-button icon="el-icon-search" type="primary" @click="getDataList()">查询</el-button>
          <el-button icon="el-icon-refresh-left" @click="resetForm()">重置</el-button>
        </el-form-item>
        <el-divider></el-divider>
      </el-form>

      <div class="avue-crud">
        <el-table
            :data="dataList"
            border
            v-loading="dataListLoading">
          <el-table-column
              prop="courseName"
              header-align="center"
              align="center"
              label="课程">
          </el-table-column>
          <el-table-column
              prop="content"
              header-align="center"
              align="center"
              label="题目">
          </el-table-column>
          <el-table-column
              prop="difficulty"
              header-align="center"
              align="center"
              label="难度等级">
            <template slot-scope="scope">
              <el-tag v-if="scope.row.difficulty === 0">低</el-tag>
              <el-tag v-if="scope.row.difficulty === 1" type="danger">中</el-tag>
              <el-tag v-if="scope.row.difficulty === 2" type="info">高</el-tag>
              <el-tag v-if="scope.row.difficulty === 3" type="warning">超高</el-tag>
            </template>
          </el-table-column>
          <el-table-column
              prop="type"
              header-align="center"
              align="center"
              label="类型">
            <template slot-scope="scope">
              <el-tag v-if="scope.row.type === 0">单选题</el-tag>
              <el-tag v-if="scope.row.type === 1" type="danger">多选题</el-tag>
              <el-tag v-if="scope.row.type === 2" type="info">判断题</el-tag>
              <el-tag v-if="scope.row.type === 4" type="info">主观题</el-tag>
            </template>
          </el-table-column>
          <el-table-column
              prop="answer"
              header-align="center"
              align="center"
              label="客观题答案">
          </el-table-column>
          <el-table-column
              prop="discussContext"
              header-align="center"
              align="center"
              label="主观题答案">
          </el-table-column>
          <el-table-column
              prop="knowledge"
              header-align="center"
              align="center"
              label="知识点">
          </el-table-column>
<!--          <el-table-column-->
<!--              prop="teacherName"-->
<!--              header-align="center"-->
<!--              align="center"-->
<!--              label="教师">-->
<!--          </el-table-column>-->
          <el-table-column
              prop="totalScore"
              header-align="center"
              align="center"
              label="分值">
          </el-table-column>
<!--          <el-table-column-->
<!--              prop="createTime"-->
<!--              header-align="center"-->
<!--              align="center"-->
<!--              label="创建时间">-->
<!--          </el-table-column>-->
<!--          <el-table-column-->
<!--              prop="updateTime"-->
<!--              header-align="center"-->
<!--              align="center"-->
<!--              label="更新时间">-->
<!--          </el-table-column>-->
        </el-table>
      </div>

      <div class="avue-crud__pagination">
        <el-pagination
            @size-change="sizeChangeHandle"
            @current-change="currentChangeHandle"
            :current-page="pageIndex"
            :page-sizes="[5, 10, 20, 50]"
            :page-size="pageSize"
            :total="totalPage"
            background
            layout="total, sizes, prev, pager, next, jumper">
        </el-pagination>
      </div>
      <span slot="footer" class="dialog-footer">
      <el-button @click="visible = false">取消</el-button>
    </span>
    </div>
  </el-dialog>
</template>

<script>
import {getItem} from '@/api/teacher/workTask'
import {getObj} from "@/api/teacher/workQuestion";

export default {
  data() {
    return {
      visible: false,
      dataForm: {
        content: '',
        courseName:'',
        taskId: ''
      },
      uploadVisible: false,
      searchForm: {},
      dataList: [],
      pageIndex: 1,
      pageSize: 5,
      totalPage: 0,
      dataListLoading: false,
      addOrUpdateVisible: false
    }
  },

  methods: {
    init(id) {
      this.dataForm.taskId = id
      this.visible = true;
      this.getDataList()
    },
    resetForm(){
      this.dataForm.content='';
      this.dataForm.courseName='';
      this.$refs['dataForm'].resetFields()
      this.getDataList()
    },
    // 获取数据列表
    getDataList() {
      if(!this.dataForm.taskId){
        return
      }
      this.dataListLoading = true
      getItem(Object.assign({
        current: this.pageIndex,
        size: this.pageSize
      }, this.dataForm)).then(response => {
        this.dataList = response.data.records
        this.totalPage = response.data.total
      })
      this.dataListLoading = false
    },
    // 每页数
    sizeChangeHandle(val) {
      this.pageSize = val
      this.pageIndex = 1
      this.getDataList()
    },
    // 当前页
    currentChangeHandle(val) {
      this.pageIndex = val
      this.getDataList()
    }
  }
}
</script>
